<%@ page language="java" contentType="text/html; charset=UTF-8"
	trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>	
<%
	String path = request.getContextPath();
%>
<!DOCTYPE html>
<html>
<head>	
    <jsp:include page="../include/indexMeta.jsp"></jsp:include>
    
    <title>后台管理系统</title>
    
	<jsp:include page="../include/indexCSS.jsp"></jsp:include>
</head>
<body class="hold-transition skin-green sidebar-mini">
<div class="wrapper">
	
	<jsp:include page="../include/indexHeader.jsp"></jsp:include>
		
	<jsp:include page="../include/indexMenu.jsp"></jsp:include>
	
	    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
	    <section class="content-header">
	      <h1>
	        ${nav.current.text}
	        <small>${nav.current.describe}</small>
	      </h1>
	      <ol class="breadcrumb">
	        <li><a href="#"><i class="fa fa-dashboard"></i> Level</a></li>
	        <li class="active">Here</li>
	      </ol>
	    </section>
	
	    <!-- Main content -->
	    <section class="content container-fluid">

			<div class="row">
				<div class="col-xs-12">
					<div class="box box-success">
			            <div class="box-header with-border">
			              <h3 class="box-title">Different Height</h3>
			            </div>
			            <div class="box-body">
			              <div id="main" style="height:400px;"></div>
			            </div>
			            <!-- /.box-body -->
		             </div>
				</div>
			</div>
			
	    </section>    
 
       <!-- /.content -->
    </div>
		
	<jsp:include page="../include/indexFoot.jsp"></jsp:include>

</div>

	<jsp:include page="../include/indexJS.jsp"></jsp:include>
	
    <c:url var="urlEchats" value="/include/lib/echarts/echarts.js" />
    <script  type="text/javascript" src="${urlEchats}"></script>
    <c:url var="urlEchatsRoot" value="/include/lib/echarts" />
    <script type="text/javascript">
        require.config({
            paths: {
                echarts: '${urlEchatsRoot}'
            }
        });
        require(
            [
                'echarts',
                'echarts/chart/line',   // 按需加载所需图表，如需动态类型切换功能，别忘了同时加载相应图表
                'echarts/chart/bar'
            ],
            function (ec) {
                var myChart = ec.init(document.getElementById('main'));
		        var option = {
				    title : {
				        text: '某楼盘销售情况',
				        subtext: '纯属虚构'
				    },
				    tooltip : {
				        trigger: 'axis'
				    },
				    legend: {
				        data:['意向','预购','成交']
				    },
				    toolbox: {
				        show : true,
				        feature : {
				            mark : {show: true},
				            dataView : {show: true, readOnly: false},
				            magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
				            restore : {show: true},
				            saveAsImage : {show: true}
				        }
				    },
				    calculable : true,
				    xAxis : [
				        {
				            type : 'category',
				            boundaryGap : false,
				            data : ['周一','周二','周三','周四','周五','周六','周日']
				        }
				    ],
				    yAxis : [
				        {
				            type : 'value'
				        }
				    ],
				    series : [
				        {
				            name:'成交',
				            type:'line',
				            smooth:true,
				            itemStyle: {normal: {areaStyle: {type: 'default'}}},
				            data:[10, 12, 21, 54, 260, 830, 710]
				        },
				        {
				            name:'预购',
				            type:'line',
				            smooth:true,
				            itemStyle: {normal: {areaStyle: {type: 'default'}}},
				            data:[30, 182, 434, 791, 390, 30, 10]
				        },
				        {
				            name:'意向',
				            type:'line',
				            smooth:true,
				            itemStyle: {normal: {areaStyle: {type: 'default'}}},
				            data:[1320, 1132, 601, 234, 120, 90, 20]
				        }
				    ]
				};
                myChart.setOption(option);
            }
        );
    </script>   
</body>
</html>
    

    
    


        